<template>
<view>
<view class="container" v-if="applyServantType">
    <view class="tongji_container" :style="'background:' + setting.platformSetting.defaultColor" data-link="servant_account.html" @tap="tolinkUrl">      
      <view class="tongji_mid font_24">{{servant.account.account}}</view>
      <view class="tongji_top">账户{{properties.alias_yue||'余额'}}（￥）</view>
      <view class="servantStatus" @click.stop="showStatusListFun">
        <text class="servantStatusShap" :style="'background:' + servantStatusShapColor"></text>
        <text>{{servantStatusText}}</text>
        <view class="servantStatusIconList">
          <image class="servantStatusIcon" src="https://image1.sansancloud.com/xianhua/2019_5/14/17/37/53_841.jpg?x-oss-process=style/preview"></image>
          <!-- <image class='servantStatusIcon' src='https://image1.sansancloud.com/xianhua/2019_5/14/17/18/29_580.jpg?x-oss-process=style/preview'></image> -->
        </view>
        <view class="servantStatusList" :animation="animation">
          <view class="servantStatusItem" @click.stop="changeServantStatus" data-type="1">
            <text class="servantStatusShap" style="background:#2dbe53;margin-left:0"></text><text>上线</text>
          </view>
          <view class="servantStatusItem" @click.stop="changeServantStatus" data-type="2">
            <text class="servantStatusShap" style="background:#999;margin-left:0"></text><text>下线</text>
          </view>
        </view>
      </view>
    </view>
  <view class="tongjiContainer_form">
      <view class="tongji_bottom">
        <view data-link="servant_will_order.html?type=2" @tap="tolinkUrl" class="tongji_bottom_item">
          <view :style="'color:' + setting.platformSetting.defaultColor + ';'">
            <text>￥</text>
            <text>{{servant.realizedServiceProfit}}</text>
          </view> 
          <text>实现服务金</text>
           <view class="borderRight2"></view>
        </view>
        <view data-link="servant_will_order.html?type=1" @tap="tolinkUrl" class="tongji_bottom_item">
          <view :style="'color:' + setting.platformSetting.defaultColor + ';'">
            <text>￥</text>
            <text>{{servant.realizedParentServiceProfit}}</text>
          </view>
          <text>实现推广金</text>
        </view>
      </view>

    <view class="servant_menu_container">
        <view class="servant_menu_item" data-link="servant_zijin.html" @tap="tolinkUrl">
            <view class="imageContainer">
                <image src="https://image1.sansancloud.com/xianhua/2018_9/5/16/19/25_19.jpg?x-oss-process=style/preview_120"></image>
            </view>
            <view class="item_text">
                <text>资金记录</text>
            </view>
            <view class="borderRight"></view>
        </view>
        <view class="servant_menu_item" data-link="process_list.html" @tap="tolinkUrl">
            <view class="imageContainer">
                <image src="https://image1.sansancloud.com/xianhua/2018_9/5/16/19/25_14.jpg?x-oss-process=style/preview_120"></image>
            </view>
            <view class="item_text">
                <text>流程列表</text>
            </view>
            <view class="borderRight"></view>
        </view>
        <view class="servant_menu_item" data-link="servant_user.html?fxLevel=1" @tap="tolinkUrl">
            <view class="imageContainer">
                <image src="https://image1.sansancloud.com/xianhua/2018_9/5/16/19/25_53.jpg?x-oss-process=style/preview_120"></image>
            </view>
            <view class="item_text">
                <text>我的推荐</text>
            </view>
            <view class="borderRight"></view>
        </view>
        <view class="servant_menu_item" :data-link="'servant_qrcode.html?code=' + servant.id" @tap="tolinkUrl">
            <view class="imageContainer">
                <image src="https://image1.sansancloud.com/xianhua/2018_9/5/16/19/25_60.jpg?x-oss-process=style/preview_120"></image>
            </view>
            <view class="item_text">
                <text>二维码</text>
            </view>
        </view>
       
            
                  
    </view>
  </view>
    
  
</view>
<view class="noServant" v-else>
  <image mode="aspectFit" class="img" src="https://image1.sansancloud.com/xianhua/2019_5/13/17/2/38_813.jpg?x-oss-process=style/preview_120"></image>
  <text>主人~!您还没有申请入住过哦~</text>
</view>
</view>
</template>

<script>

export default {
  data() {
    return {
      setting: {},
      loginUser: null,
      servant: {
        account: {
          account: 0
        },
        totalEarningAmount: 0.00,
        totalTixianAmount: 0.00,
        waitCompleteOrderDistributeAmount: 0.00
      },
      account: {
        account: 0
      },
      applyServantType: true,
      servantStatusShapColor: "#2dbe53",
      servantStatusText: "在线",
      showStatusList: false,
      animation: ""
    };
  },

  components: {},
  props: {},

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    let that = this;
    console.log('======app.loginUser======', getApp().globalData.loginUser);

    if (getApp().globalData.loginUser) {
      that.checkState();
    } else {
      // wx.showLoading({
      //   title: 'loading'
      // })
      getApp().globalData.showToastLoading('loading', true);
      getApp().globalData.addLoginListener(that);
      console.log("====setTimeout1=====");
      that.setTimeoutLogin(that.conut);
    }

    that.setData({
      setting: getApp().globalData.setting,
      loginUser: getApp().globalData.loginUser
    });
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {},

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {},

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {},

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {},

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    this.onLoad();
    setTimeout(function () {
      wx.stopPullDownRefresh();
    }, 2000);
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {}
  /**
   * 用户点击右上角分享
   */
  ,
  methods: {
    changeServantStatus: function (e) {
      console.log("==============changeServantStatus===============", e);
      let status = e.currentTarget.dataset.type;
      let params = {
        status: status
      };
      var customIndex = getApp().globalData.AddClientUrl("/wx_set_servant_status.html", params, 'post');
      var that = this; // wx.showLoading({
      //   title: 'loading'
      // })

      getApp().globalData.showToastLoading('loading', true);
      wx.request({
        url: customIndex.url,
        data: customIndex.params,
        header: getApp().globalData.headerPost,
        method: 'POST',
        success: function (res) {
          wx.hideLoading();
          console.log("=============success=============", res.data);
          that.showStatusListFun();

          if (res.data.errcode == '0') {
            let servant = res.data.relateObj;
            that.setServantStatus(servant);
          } else {
            wx.showModal({
              title: '失败了',
              content: '请求失败了，请下拉刷新！'
            });
          }
        }
      });
    },
    setServantStatus: function (servant) {
      let that = this;

      if (servant.status == 2) {
        that.setData({
          servantStatusShapColor: "#999",
          servantStatusText: "下线"
        });
      } else if (servant.status == 3) {
        that.setData({
          servantStatusShapColor: "#ed5254",
          servantStatusText: "繁忙"
        });
      } else if (servant.status == 4) {
        that.setData({
          servantStatusShapColor: "#ed5254",
          servantStatusText: "禁用"
        });
      } else if (servant.status == 0) {
        that.setData({
          servantStatusShapColor: "#666",
          servantStatusText: "未审核"
        });
      } else if (servant.status == 1) {
        that.setData({
          servantStatusShapColor: "#2dbe53",
          servantStatusText: "在线"
        });
      } else {}
    },
    showStatusListFun: function () {
      console.log("=====showStatusListFun=====");
      let animation = wx.createAnimation({
        duration: 300,
        timingFunction: 'ease-out'
      });

      if (this.showStatusList) {
        animation.height(0).step();
        this.setData({
          showStatusList: false
        });
      } else {
        animation.height(56).step();
        this.setData({
          showStatusList: true
        });
      }

      this.setData({
        animation: animation.export()
      });
    },

    /* 组件事件集合 */
    tolinkUrl: function (e) {
      let linkUrl = e.currentTarget.dataset.link;
      getApp().globalData.linkEvent(linkUrl);
    },
    submitFormId: function (e) {
      this.toApplyForFacilitator(e);
    },
    getservantInfo: function () {
      console.log('-------门店-1-------');
      let params = {};
      var customIndex = getApp().globalData.AddClientUrl("/super_shop_manager_get_manager_servant_info.html", params, 'post');
      var that = this; // wx.showLoading({
      //     title: 'loading'
      // })

      getApp().globalData.showToastLoading('loading', true);
      wx.request({
        url: customIndex.url,
        data: customIndex.params,
        header: getApp().globalData.headerPost,
        method: 'POST',
        success: function (res) {
          wx.hideLoading();
          console.log(res.data);

          if (res.data.errcode == '0') {
            let servant = res.data.relateObj;
            that.setServantStatus(servant);
            servant = that.dellMoney(servant); //account 账户余额

            that.setData({
              servant: servant
            });
            that.setNav(servant);
          } else {
            wx.showModal({
              title: '失败了',
              content: res.data.errMsg
            });
          }
        }
      });
    },

    /* 组件事件集合 */
    tolinkUrl: function (e) {
      let linkUrl = e.currentTarget.dataset.link;
      getApp().globalData.linkEvent(linkUrl);
    },
    dellMoney: function (servant) {
      if (servant.account && servant.account.account) {
        servant.account.account = getApp().globalData.toFix(servant.account.account);
      } else {
        servant.account = {
          account: getApp().globalData.toFix(0)
        };
      }

      servant.realizedParentServiceProfit = getApp().globalData.toFix(servant.realizedParentServiceProfit);
      servant.realizedServiceProfit = getApp().globalData.toFix(servant.realizedServiceProfit);
      return servant;
    },
    setNavColor: function () {
      wx.setNavigationBarColor({
        frontColor: '#ffffff',
        backgroundColor: getApp().globalData.setting.platformSetting.defaultColor
      });
    },
    setNav: function (servant) {
      console.log('app.setting', getApp().globalData.setting);
      wx.setNavigationBarTitle({
        title: servant.name
      });
    },
    //扫一扫 登录后台
    toLoginBackstage: function (e) {
      wx.scanCode({
        onlyFromCamera: true,
        success: scanRes => {
          let params = {};
          var customIndex = getApp().globalData.AddClientUrl("/wx_mini_scan_uuid.html", params, 'post');

          if (scanRes.errMsg == 'scanCode:ok') {
            let {
              result
            } = scanRes; // 跳转-确认、取消登录页面

            wx.navigateTo({
              url: '/pages/scan_login/scan_login?scan_result=' + result,

              success(data) {
                wx.request({
                  url: customIndex.url,
                  data: customIndex.params,
                  header: getApp().globalData.headerPost,
                  method: 'POST',
                  success: function (res) {
                    console.log('扫码成功');
                  },
                  fail: function (res) {}
                });
              }

            });
          }
        }
      });
    },
    //跳转到申请服务商web页面
    toApplyForFacilitator: function (e) {
      wx.navigateTo({
        url: '/pages/apply_for_facilitator/apply_for_facilitator?formId=' + e.detail.formId
      });
    },
    loginSuccess: function (user) {
      console.log("pre apply mendian login success call back!", user);
      this.checkState();
    },
    loginFailed: function (err) {
      console.log("login failed!!");
    },
    checkState: function () {
      let that = this;
      console.log('======checkState.loginUser======', getApp().globalData.loginUser);
      that.setData({
        setting: getApp().globalData.setting,
        loginUser: getApp().globalData.loginUser
      });
      this.setNavColor();
      this.getservantInfo();

      if (!getApp().globalData.loginUser.platformUser.managerServantId) {
        console.log("=========没有归属服务员=========");
        this.setData({
          applyServantType: false
        });
        return;
      }
    },
    setTimeoutLogin: function (conuData) {
      let that = this;
      console.log("====setTimeout-init=====", conuData);
      that.conut = conuData;
      that.conut += 2;

      if (that.conut <= 5) {
        setTimeout(function () {
          if (getApp().globalData.loginUser) {
            wx.hideLoading();
          } else {
            that.setTimeoutLogin(that.conut);
          }
        }, that.conut * 1000);
      } else {
        wx.showModal({
          title: '失败了',
          content: '请求失败了，请下拉刷新！'
        });
      }
    },
    setData: function (obj) {
      let that = this;
      let keys = [];
      let val, data;
      Object.keys(obj).forEach(function (key) {
        keys = key.split('.');
        val = obj[key];
        data = that.$data;
        keys.forEach(function (key2, index) {
          if (index + 1 == keys.length) {
            that.$set(data, key2, val);
          } else {
            if (!data[key2]) {
              that.$set(data, key2, {});
            }
          }

          data = data[key2];
        });
      });
    }
  }
};
</script>
<style>
@import "./index.css";
</style>